{% extends "base.html" %}
{% import "bootstrap/wtf.html" as wtf %}
{% import "_macros.html" as macros %}

{% block title %}语音识别模型基准测试系统{% endblock %}

{% block page_content %}
<div class="page-header">
    <p>目前共有{{ bt_hosts.total }}条执行基准测试接口数据项</p>
    <a class="btn btn-default" href="{{ url_for('.bt_host_add') }}">新增基准测试接口</a>
    {% if bt_hosts.first==0 %}
    <p>没有执行基准测试任务接口信息</p>
    {% else %}
    <div class="row">
    <table class="table">
        <thead>
        <tr>
            <th>ip</th>
            <th>端口号</th>
            <th>上次活动时间</th>
            <th>连通性</th>
            <th>访问链接</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {% for bt_host in bt_hosts.items %}
        <tr>
            <td>{{ bt_host.ip }}</td>
            <td>{{ bt_host.port }}</td>
            <td>{{ bt_host.last_active }}</td>
            <td id="bt-host-is-connectivity-{{ bt_host.id }}">
                {% if bt_host.b_connect %}
                    可连通
                {% else %}
                    不可连通
                {% endif %}
            </td>
            <td><a href="http://{{ bt_host.ip }}:{{ bt_host.port }}">http://{{ bt_host.ip }}:{{ bt_host.port }}</a></td>
            <td>
                <a class="btn btn-default" id="test-connectivity-{{ bt_host.id }}" href="javascript:void(0)" onclick="start_test_connectivity({{ bt_host.id }})">测试连通性</a>
                <a class="btn btn-default" href="{{ url_for('.bt_host_edit',id=bt_host.id) }}">修改</a>
                <a class="btn btn-default" href="{{ url_for('.bt_host_delete',id=bt_host.id,page=page,per_page=per_page) }}">删除</a>
                <a class="btn btn-default" href="{{ url_for('.bt_devices',id=bt_host.id)}}">计算设备详情</a>
            </td>
        </tr>
        {% endfor %}
        </tbody>
        <tfoot>
            <tr>
                <td colspan="3">
                    <ul class="pagination">
                        {% for i in page_range %}
                        {% if i==bt_hosts.page %}
                        <li class="active"><a href="/bt_service?page={{ i }}&per_page={{ per_page }}">{{ i }}</a></li>
                        {% else %}
                        <li><a href="/bt_service?page={{ i }}&per_page={{ per_page }}">{{ i }}</a></li>
                        {% endif %}
                        {% endfor %}
                    </ul>
                </td>
                <td colspan="3" style="vertical-align:bottom">
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">当前每页{{ per_page }}条数据项，更改至每页数据项 <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            {% for i in [5,10,20,50] %}
                            <li><a href="/bt_service?page=1&per_page={{ i }}">{{ i }}条</a></li>
                            {% endfor %}
                        </ul>
                    </li>
                </td>
                <td>
                    <span id="span-1"></span><br>
    <span id="span-2"></span><br>
    <span id="span-3"></span>
                </td>
            </tr>
        </tfoot>
    </table>
</div>
    {% endif %}
</div>
<script type="text/javascript">
    function start_test_connectivity(bt_host_id){
        $.ajax({
            type:'POST',
            url:'/test_connectivity/'+bt_host_id,
            success: function(data,status,request){
                status_url=request.getResponseHeader('Location');
                update_status(status_url,bt_host_id);
            },
            error:function(){
                alert('请求检测主机的可连接性的过程中出现错误');
            }
        });
    }
    function update_status(status_url,bt_host_id){
        $.getJSON(status_url,function(data){
            $('#span-1').text($('#span-2').text());
            $('#span-2').text($('#span-3').text());
            if ('result' in data){
                $('#span-3').text(data['time']+' '+data['status']+' '+data['result']);
                if (data['result']==true){
                    $('#bt-host-is-connectivity-'+bt_host_id.toString()).text('可连通');
                }else{
                    $('#bt-host-is-connectivity-'+bt_host_id.toString()).text('不可连通');
                }
            }else{
                $('#span-3').text(data['time']+' '+data['state']+' '+data['status'])
            }
            if (data['state']=='PENDING' ||data['state']=='PROGRESS'){
                setTimeout(function(){
                    update_status(status_url,bt_host_id);
                },1000);
            }
        });
    }
</script>
{% endblock %}